$(function () {
    initSWiper()
    // 获取数据并渲染到页面中
    function initSWiper() {
        $.ajax({
            method: 'get',
            url: '/admin/swipers',
            success(res) {
                console.log(res);
                // console.log(data);
                // 判断
                if (res.status !== 0) return layui.layer.msg(res.message, { icon: 5 })
                // 渲染数据
                console.log('fsfsdafdsa', res.data.length)
                let htmlStr = template('tpl-swipers', res)
                $('tbody').html(htmlStr)
                
            }
        })
    }
    // 修改轮播图的状态
    $('tbody').on('click', '.layui-badge', function () {
        // alert('123'
        var status = $(this).attr('data-status')
        var id = $(this).attr('data-id')
        console.log(status);
        // 判断状态是1或者2 是1 的话修改成2
        if (status == 2) {
            status = 1
        } else {
            status = 2

        }
        $.ajax({
            method: 'put',
            url: '/admin/swipers/' + id,
            data: { status },
            success(res) {
                console.log(res);
                console.log(res.data);
                if (res.status !== 0) return layui.layer.msg(res.message, { icon: 5 })
                
                layui.layer.msg(res.message, { icon: 6 }, function () {
                    initSWiper()
                })
            }
        })
    })
    // 上传轮播图
    // 点击图片上传按钮，弹出文件选择框
    $('#uploadSwiper').on('click', function () {
        $('#myfile').click()
    })
    $('#myfile').on('change', function () {
        var fileList = this.files
        if (fileList.length < 0) {
            return layui.layer.msg('请选择照片：', { icon: 5 })
        }
        console.log(fileList);
        var fd = new FormData();
        // fd.append('cover_img', fileList)
        //上传多个文件的用法：
        for (var i = 0; i < fileList.length; i++) {
            fd.append('swipers', fileList[i])
        }
        console.log(fd);
        updateSwiper(fd)
    })
    function updateSwiper(fd) {
        // 批量上传轮播图
        $.ajax({
            method: 'post',
            url: '/admin/swipers',
            data: fd,
            contentType: false,
            processData: false,
            success(res) {
                console.log(res);
                // 判斷
                if (res.status !== 0) {
                    return layui.layer.msg(res.message, { icon: 5 })
                }
                layui.layer.msg(res.message, { icon: 6 }, function () {
                    // 渲染到页面中
                    initSWiper()

                })
            }
        })
    }

    // 删除轮播图
    // 给删除按钮绑定click事件
    $('tbody').on('click', '.delete', function () {
        var id = $(this).attr('data-id')
        console.log(id);
        // 询问
        layui.layer.confirm('您确定要删除此分类吗?', { icon: 3, title: '提示' }, function (index) {
            //do something
            // 调接口，删除分类
            $.ajax({
                method: 'DELETE',
                url: '/admin/swipers/' + id,
                success(res) {
                    // console.log(res)
                    // 判断
                    if (res.status !== 0) {
                        return layui.layer.msg(res.message, { icon: 5 })
                    }
                    layui.layer.msg(res.message, { icon: 6 })
                    // 重新获取分类数据，重新渲染
                    initSWiper()
                }
            })
            layui.layer.close(index)
        })

    })

    

})